<template>
    <div>
        <el-row>
            <el-col style="margin-left: 100px;">
                <el-button type="small" @click="selectedType = 'goods'" v-model="goodsOrderParam.addType">物品</el-button>
                <el-button type="small" @click="selectedType = 'medicine'"
                    v-model="medicineOrderParam.addType">药品</el-button>
            </el-col>
        </el-row>
        <el-row class="section">
            <el-col class="offset">
                <div class="info">
                    <div class="line"></div>
                    <div class="text">基本信息</div>
                </div>
            </el-col>
            <el-form :inline="true" class="demo-input-size" v-if="selectedType === 'goods'">
                <!-- 物品表单项 -->
                <el-form-item class="offset">
                    <template slot="label">
                        <span>物资编码</span>
                        <span style="color: red;">*</span>
                    </template>
                    <el-input v-model="goodsOrderParam.itemCode" size="medium" placeholder="请输入"
                        style="width:200px"></el-input>
                </el-form-item>
                <el-form-item class="offset">
                    <template slot="label">
                        <span>物资名称</span>
                        <span style="color: red;">*</span>
                    </template>
                    <el-input v-model="goodsOrderParam.itemName" size="medium" placeholder="请输入"
                        style="width:200px"></el-input>
                </el-form-item>
                <el-form-item class="offset">
                    <template slot="label">
                        <span>物资类型</span>
                        <span style="color: red;">*</span>
                    </template>
                    <el-select v-model="goodsOrderParam.itemType" placeholder="请选择">
                        <el-option v-for="ItemType in DictItemTypeDate" :key="ItemType.id" :label="ItemType.name"
                            :value="ItemType.id">
                        </el-option>
                    </el-select>
                </el-form-item><br>
                <el-form-item class="offset">
                    <template slot="label">
                        <span>拼音码</span>
                    </template>
                    <el-input v-model="goodsOrderParam.pinyinCode" size="medium" placeholder="请输入"
                        style="width:200px"></el-input>
                </el-form-item>
                <el-form-item class="offset">
                    <template slot="label">
                        <span>规格型号</span>
                        <span style="color: red;">*</span>
                    </template>
                    <el-input v-model="goodsOrderParam.spAndModels" size="medium" placeholder="请输入"
                        style="width:200px"></el-input>
                </el-form-item>
                <el-form-item class="offset">
                    <template slot="label">
                        <span>包装单位</span>
                    </template>
                    <el-select v-model="goodsOrderParam.packingUnits" size="medium" placeholder="请输入"
                        style="width:200px">
                        <el-option v-for="packingUnits in PackingUnitsDate" :key="packingUnits.id"
                            :label="packingUnits.name" :value="packingUnits.id">
                        </el-option>
                    </el-select>
                </el-form-item><br>
                <el-form-item class="offset">
                    <template slot="label">
                        <span>采购单价</span>
                        <span style="color: red;">*</span>
                    </template>
                    <el-input v-model="goodsOrderParam.purchasePrice" size="medium" placeholder="请输入"
                        style="width:200px"></el-input>
                </el-form-item>
                <el-form-item class="offset">
                    <template slot="label">
                        <span>零售单价</span>
                        <span style="color: red;">*</span>
                    </template>
                    <el-input v-model="goodsOrderParam.retailPrice" size="medium" placeholder="请输入"
                        style="width:200px"></el-input>
                </el-form-item>
                <el-form-item class="offset">
                    <template slot="label">
                        <span>生产厂商</span>
                        <span style="color: red;">*</span>
                    </template>
                    <el-select v-model="goodsOrderParam.manufacturer" placeholder="请选择">
                        <el-option v-for="Manufacturer in DictManufacturerDate" :key="Manufacturer.id"
                            :label="Manufacturer.name" :value="Manufacturer.id">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item class="offset">
                    <template slot="label">
                        <span>有效期</span>
                        <span style="color: red;">*</span>
                    </template>
                    <el-input v-model="expiration" size="medium" placeholder="请输入" style="width:150px;"></el-input>
                    <el-select v-model="dmy" placeholder="请选择" style="width: 100px;">
                        <el-option label="天" value="天"></el-option>
                        <el-option label="月" value="月"></el-option>
                        <el-option label="年" value="年"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item class="offset">
                    <template slot="label">
                        <span>生产日期</span>
                        <span style="color: red;">*</span>
                    </template>
                    <el-date-picker v-model="goodsOrderParam.productionTime" type="date" placeholder="请选择日期"
                        style="width: 200px;" value-format="yyyy-MM-dd">
                    </el-date-picker>
                </el-form-item>
                <el-form-item class="offset">
                    <template slot="label">
                        <span>启动状态</span>
                        <span style="color: red;">*</span>
                    </template>
                    <el-radio label="1" v-model="goodsOrderParam.status">启用</el-radio>
                    <el-radio label="0" v-model="goodsOrderParam.status">禁用</el-radio>
                </el-form-item><br>
                <el-col class="offset">
                    <div class="info">
                        <div class="line"></div>
                        <div class="text">其他信息</div>
                    </div>
                </el-col>
                <el-col>
                    <el-form-item class="offset">
                        <template slot="label">
                            <span>有效期预警</span>
                        </template>
                        <el-input v-model="goodsOrderParam.earlyWarning" size="medium" placeholder="请输入"
                            style="width:200px">
                            <template slot="append">天</template>
                        </el-input>
                    </el-form-item>
                    <el-form-item class="offset">
                        <template slot="label">
                            <span>库存</span>
                        </template>
                        <el-input v-model="goodsOrderParam.store" size="medium" placeholder="请输入"
                            style="width:200px"></el-input>
                    </el-form-item><br>
                    <el-form-item class="offset">
                        <template slot="label">
                            <span>物资说明</span>
                        </template>
                        <el-input v-model="goodsOrderParam.materialExplain" type="textarea" placeholder="请输入内容"
                            style="width: 870px;"></el-input>
                    </el-form-item>
                    <el-form-item class="offset">
                        <template slot="label">
                            <span>备注</span>
                        </template>
                        <el-input v-model="goodsOrderParam.remark" type="textarea" placeholder="请输入内容"
                            style="width: 900px;"></el-input>
                    </el-form-item>
                </el-col>
                <el-row class="offset offset2">
                    <el-button type="small" @click="Save">保存</el-button>
                    <el-button type="small" @click="Cancel">取消</el-button>
                </el-row>
            </el-form>

            <el-form :inline="true" class="demo-input-size" v-if="selectedType === 'medicine'">
                <!-- 药品表单项 -->
                <el-form-item class="offset">
                    <template slot="label">
                        <span>物资编码</span>
                        <span style="color: red;">*</span>
                    </template>
                    <el-input v-model="medicineOrderParam.itemCode" size="medium" placeholder="请输入"
                        style="width:200px"></el-input>
                </el-form-item>
                <el-form-item class="offset">
                    <template slot="label">
                        <span>物资名称</span>
                        <span style="color: red;">*</span>
                    </template>
                    <el-input v-model="medicineOrderParam.itemName" size="medium" placeholder="请输入"
                        style="width:200px"></el-input>
                </el-form-item>
                <el-form-item class="offset">
                    <template slot="label">
                        <span>物资类型</span>
                        <span style="color: red;">*</span>
                    </template>
                    <el-select v-model="medicineOrderParam.itemType" placeholder="请选择">
                        <el-option v-for="ItemType in DictItemTypeDate" :key="ItemType.id" :label="ItemType.name"
                            :value="ItemType.id">
                        </el-option>
                    </el-select>
                </el-form-item><br>
                <el-form-item class="offset">
                    <template slot="label">
                        <span>拼音码</span>
                    </template>
                    <el-input v-model="medicineOrderParam.pinyinCode" size="medium" placeholder="请输入"
                        style="width:200px"></el-input>
                </el-form-item>
                <el-form-item class="offset">
                    <template slot="label">
                        <span>规格型号</span>
                        <span style="color: red;">*</span>
                    </template>
                    <el-input v-model="medicineOrderParam.spAndModels" size="medium" placeholder="请输入"
                        style="width:200px"></el-input>
                </el-form-item>
                <el-form-item class="offset">
                    <template slot="label">
                        <span>包装单位</span>
                    </template>
                    <el-select v-model="medicineOrderParam.packingUnits" size="medium" placeholder="请输入"
                        style="width:200px">
                        <el-option v-for="packingUnits in PackingUnitsDate" :key="packingUnits.id"
                            :label="packingUnits.name" :value="packingUnits.id">
                        </el-option>
                    </el-select>
                </el-form-item><br>
                <el-form-item class="offset">
                    <template slot="label">
                        <span>采购单价</span>
                        <span style="color: red;">*</span>
                    </template>
                    <el-input v-model="medicineOrderParam.purchasePrice" size="medium" placeholder="请输入"
                        style="width:200px"></el-input>
                </el-form-item>
                <el-form-item class="offset">
                    <template slot="label">
                        <span>零售单价</span>
                        <span style="color: red;">*</span>
                    </template>
                    <el-input v-model="medicineOrderParam.retailPrice" size="medium" placeholder="请输入"
                        style="width:200px"></el-input>
                </el-form-item>
                <el-form-item class="offset">
                    <template slot="label">
                        <span>生产厂商</span>
                        <span style="color: red;">*</span>
                    </template>
                    <el-select v-model="medicineOrderParam.manufacturer" placeholder="请选择">
                        <el-option v-for="Manufacturer in DictManufacturerDate" :key="Manufacturer.id"
                            :label="Manufacturer.name" :value="Manufacturer.id">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item class="offset">
                    <template slot="label">
                        <span>有效期</span>
                        <span style="color: red;">*</span>
                    </template>
                    <el-input v-model="expiration" size="medium" placeholder="请输入" style="width:150px;"></el-input>
                    <el-select v-model="dmy" placeholder="请选择" style="width: 100px;">
                        <el-option label="天" value="天"></el-option>
                        <el-option label="月" value="月"></el-option>
                        <el-option label="年" value="年"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item class="offset">
                    <template slot="label">
                        <span>生产日期</span>
                        <span style="color: red;">*</span>
                    </template>
                    <el-date-picker v-model="medicineOrderParam.productionTime" type="date" placeholder="请选择日期"
                        style="width: 200px;" value-format="yyyy-MM-dd">
                    </el-date-picker>
                </el-form-item>
                <el-form-item class="offset">
                    <template slot="label">
                        <span>启动状态</span>
                        <span style="color: red;">*</span>
                    </template>
                    <el-radio :label="1" v-model="medicineOrderParam.status">启用</el-radio>
                    <el-radio :label="0" v-model="medicineOrderParam.status">禁用</el-radio>
                </el-form-item><br>
                <el-col class="offset">
                    <div class="info">
                        <div class="line"></div>
                        <div class="text">药品信息</div>
                    </div>
                </el-col>
                <el-col>
                    <el-form-item class="offset">
                        <template slot="label">
                            <span>药品剂型</span>
                        </template>
                        <el-select v-model="medicineOrderParam.medicinType" placeholder="请选择">
                            <el-option v-for="MedicinType in MedicinTypeDate" :key="MedicinType.id"
                                :label="MedicinType.name" :value="MedicinType.id">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item class="offset">
                        <template slot="label">
                            <span>用药方式</span>
                        </template>
                        <el-select v-model="medicineOrderParam.medicinMethod" placeholder="请选择">
                            <el-option v-for="MedicinMethod in MedicinMethodDate" :key="MedicinMethod.id"
                                :label="MedicinMethod.name" :value="MedicinMethod.id">
                            </el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col class="offset">
                    <div class="info">
                        <div class="line"></div>
                        <div class="text">其他信息</div>
                    </div>
                </el-col>
                <el-col>
                    <el-form-item class="offset">
                        <template slot="label">
                            <span>有效期预警</span>
                        </template>
                        <el-input v-model="medicineOrderParam.earlyWarning" size="medium" placeholder="请输入"
                            style="width:200px">
                            <template slot="append">天</template>
                        </el-input>
                    </el-form-item>
                    <el-form-item class="offset">
                        <template slot="label">
                            <span>库存</span>
                        </template>
                        <el-input v-model="medicineOrderParam.store" size="medium" placeholder="请输入"
                            style="width:200px"></el-input>
                    </el-form-item><br>
                    <el-form-item class="offset">
                        <template slot="label">
                            <span>物资说明</span>
                        </template>
                        <el-input v-model="medicineOrderParam.materialExplain" type="textarea" placeholder="请输入内容"
                            style="width: 870px;"></el-input>
                    </el-form-item>
                    <el-form-item class="offset">
                        <template slot="label">
                            <span>备注</span>
                        </template>
                        <el-input v-model="medicineOrderParam.remark" type="textarea" placeholder="请输入内容"
                            style="width: 900px;"></el-input>
                    </el-form-item>
                </el-col>
                <el-row class="offset offset2">
                    <el-button type="small" @click="Save1">保存</el-button>
                    <el-button type="small" @click="Cancel1">取消</el-button>
                </el-row>
            </el-form>
        </el-row>
    </div>
</template>

<script>
export default {
    data() {
        return {
            selectedType: 'goods', // 默认选中物品
            DictItemTypeDate: [],
            DictManufacturerDate: [],
            PackingUnitsDate: [],
            MedicinTypeDate: [],
            MedicinMethodDate: [],
            goodsOrderParam: {
                addType: 'goods',
                itemCode: '',
                itemName: '',
                itemType: '',
                pinyinCode: '',
                spAndModels: '',
                packingUnits: '',
                purchasePrice: '',
                retailPrice: '',
                manufacturer: '',
                productionTime: '',
                status: '',
                earlyWarning: '',
                store: '',
                materialExplain: '',
                remark: '',
                expirationDate: ''
            },
            medicineOrderParam: {
                addType: 'medicine',
                itemCode: '',
                itemName: '',
                itemType: '',
                pinyinCode: '',
                spAndModels: '',
                packingUnits: '',
                purchasePrice: '',
                retailPrice: '',
                manufacturer: '',
                productionTime: '',
                status: '',
                earlyWarning: '',
                store: '',
                materialExplain: '',
                remark: '',
                expirationDate: '',
                medicinType: '',
                medicinMethod: ''
            },
            dmy: '',
            expiration: '',
        };
    },
    methods: {
        //查询物资类型
        queryDictItemType() {
            this.$axios.get('api/dict/queryDict/' + 10)
                .then(res => {
                    if (res.data.code == 200) {
                        this.DictItemTypeDate = res.data.data
                    }
                })
        },
        //查询生产厂家
        queryManufacturer() {
            this.$axios.get('api/dict/queryDict/' + 13)
                .then(res => {
                    if (res.data.code == 200) {
                        this.DictManufacturerDate = res.data.data
                    }
                })
        },
        //查询包装单位
        queryPackingUnits() {
            this.$axios.get('api/dict/queryDict/' + 18)
                .then(res => {
                    if (res.data.code == 200) {
                        this.PackingUnitsDate = res.data.data
                    }
                })
        },
        //查药品剂型
        queryMedicinType() {
            this.$axios.get('api/dict/queryDict/' + 30)
                .then(res => {
                    if (res.data.code == 200) {
                        this.MedicinTypeDate = res.data.data
                    }
                })
        },
        //查用药方式
        queryMedicinMethod() {
            this.$axios.get('api/dict/queryDict/' + 37)
                .then(res => {
                    if (res.data.code == 200) {
                        this.MedicinMethodDate = res.data.data
                    }
                })
        },
        Save() {
            // 获取当前日期
            let currentDate = new Date();
            // 将生产日期字符串转换为日期对象
            let productionDate = new Date(this.goodsOrderParam.productionTime);
            // 检查生产日期是否大于当前日期
            if (productionDate > currentDate) {
                // 生产日期大于当前日期，显示错误提示并返回
                this.$message({
                    type: 'error',
                    message: '生产日期不能大于当前日期！'
                });
                return;
            }
            this.goodsOrderParam.expirationDate = `${this.expiration}${this.dmy}`;
            this.goodsOrderParam.earlyWarning = this.goodsOrderParam.earlyWarning;
            this.$axios.post('api/material/insertMaterialInfo', this.goodsOrderParam)
                .then(res => {
                    if (res.data.code == 200) {
                        this.$message({
                            type: 'success',
                            message: '添加成功!'
                        });
                        this.$router.push({ path: '/materialinfoMt' })
                    }else{
                        this.$message({
                            type: 'error',
                            message: '参数有误!'
                        });
                    }
                })

        },
        Save1() {
              // 获取当前日期
            let currentDate = new Date();
            // 将生产日期字符串转换为日期对象
            let productionDate = new Date(this.medicineOrderParam.productionTime);
            // 检查生产日期是否大于当前日期
            if (productionDate > currentDate) {
                // 生产日期大于当前日期，显示错误提示并返回
                this.$message({
                    type: 'error',
                    message: '生产日期不能大于当前日期！'
                });
                return;
            }
            this.medicineOrderParam.expirationDate = `${this.expiration}${this.dmy}`;
            this.medicineOrderParam.earlyWarning = this.medicineOrderParam.earlyWarning;
            this.$axios.post('api/material/insertMaterialInfo', this.medicineOrderParam)
                .then(res => {
                    if (res.data.code == 200) {
                        this.$message({
                            type: 'success',
                            message: '添加成功!'
                        });
                        this.$router.push({ path: '/materialinfoMt' })
                    }else{
                        this.$message({
                            type: 'error',
                            message: '内容为空!'
                        });
                    };
                })

        },
        Cancel() {
            this.$router.push({ path: '/materialinfoMt' })
        },
        Cancel1() {
            this.$router.push({ path: '/materialinfoMt' })
        }
    },
    created() {
        this.queryDictItemType();
        this.queryManufacturer();
        this.queryPackingUnits();
        this.queryMedicinType();
        this.queryMedicinMethod();
    }
}
</script>

<style scoped>
.section {
    width: 1100px;
    height: 800px;
    background-color: white;
    margin-left: 100px;
    margin-top: 20px;
}

.offset {
    margin-top: 25px;
    margin-left: 50px;
}

.offset1 {
    margin-left: 1px;
}

.offset2 {
    margin-left: 900px;
}

.info {
    display: flex;
    align-items: center;
}

.line {
    width: 3px;
    /* 改变线的宽度 */
    height: 20px;
    /* 改变线的高度 */
    background-color: rgb(0, 174, 255);
    /* 改变线的颜色 */
    margin-right: 8px;
}

.text {
    color: rgb(0, 174, 255);
}
</style>